import { createStore } from 'vuex'
import { uuid } from 'vue-uuid';
import { createVuexPersistedState } from "vue-persistedstate";
export default createStore({
  state: {
    // 购物车列表
    cartList: [],
    addressList: [
      {
        id: '1',
        name: '张三',
        tel: '13000000000',
        address: '浙江省杭州市西湖区文三路 138 号东方通信大厦 7 楼 501 室',
        isChecked: true,
        province: '浙江省',
        city: '杭州市',
        county: '西湖区',
        addressDetail: '文三路 138 号东方通信大厦 7 楼 501 室',
      },
      {
        id: '2',
        name: '李四',
        tel: '13100000000',
        address: '浙江省杭州市拱墅区莫干山路 50 号',
        isChecked: false,
        province: '浙江省',
        city: '杭州市',
        county: '拱墅区',
        addressDetail: '莫干山路 50 号',
      },
    ]
  },
  getters: {
    totalCount(state) {
      // 总数： carList中所有商品的数量和
      let res = 0
      state.cartList.forEach(item => {
        res += item.count
      })
      return res
    },
    totalPrice(state) {
      // 总价格： cartList中被选中的商品 价格*数量
      let res = 0
      state.cartList.forEach(item => {
        if (item.checked) {
          res += item.count * item.price
        }
      })
      return res * 100
    },
    // 订单列表
    orderList(state) {
      return state.cartList.filter(item => item.checked)
    },
    checkedAddress(state) {
      return state.addressList.find(item => item.isChecked)
    }
  },
  mutations: {
    addItem(state, payload) {
      // 这个商品已经在购物车中，那点击时应该是 数量+1
      // 没有在购物车，就加入购物车 push到  cartList
      const index = state.cartList.findIndex(item => item.id === payload.id)
      if (index > -1) {
        state.cartList[index].count++
      } else {
        state.cartList.push({
          ...payload,
          count: 1,
          chaecked: false
        })
      }
    },
    changecheck(state, payload) {
      state.cartList.forEach(item => item.checked = payload)
    },
    deleteCart(state, payload) {
      state.cartList = state.cartList.filter(item => item.id != payload)
    },
    changeisChecked(state, id) {
      // 选中张三这一条 应该是张三这条数据的isChecked为true,其他的都改为false
      state.addressList.forEach(item => {
        // 把所有的item中的isChecked都改为false, 把选中的（传过来id）那条 设为true
        item.isChecked = false
        if (item.id === id) {
          item.isChecked = true
        }
      })
    },
    // 购物车列表数据单选框和步进器的值发生变化时更新cartList
    updatecartList(state, payload) {
      state.cartList = payload
    },
    addAddress(state, payload) {
      state.addressList.push({ ...payload, id: uuid.v1() })
    },
    editAddress(state, payload) {
      state.addressList.forEach(item => {
        if (item.id == payload.id) {
          item.name = payload.name
          item.tel = payload.tel
          item.address = payload.address
          item.province = payload.province
          item.city = payload.city
          item.county = payload.county
          item.addressDetail = payload.addressDetail
        }
      })
    }
  },
  actions: {
  },
  modules: {
  },
  plugins: [
    createVuexPersistedState({
      key: 'vuex',
      storage: window.localStorage,
    }),
  ]
})
